<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>插入多行文本框</title>
    <script type="text/javascript" src="../internal.js"></script>
    <link rel="stylesheet" href="../../../bootstrap/bootstrap.css">
    <link rel="stylesheet" href="../../../bootstrap/bootstrap-responsive.css">
    <style type="text/css">
        * {
            color: #838383;
            margin: 0;
            padding: 0
        }

        html, body {
            font-size: 12px;
            overflow: hidden;
        }

        body {
            padding-left: 20px;
            padding-right: 20px;
            width: 400px;
        }
    </style>
</head>
<body>
<table class="table table-striped table-bordered" style="margin-top:18px;margin-bottom: 0;">
    <tr>
        <th><span>控件名称</span><span class="label label-important">*</span></th>
        <th><span>字体大小</span></th>
    </tr>
    <tr>
        <td><input id="areaName" type="text" placeholder="必填项" size="20"/></td>
        <td><input id="areaFontSize" type="text" size="20" value="12"/></td>
    </tr>
    <tr>
        <th><span>输入框样式</span></th>
        <th><span>增强</span></th>
    </tr>
    <tr>
        <td> 宽： <input id="areaWidth" value="300" type="text" size="3"/> 高 ： <input id="areaHeight" value="80"
                                                                                    type="text" size="3"/></td>
        <td><label><input id="richText" type="checkbox"/> 富文本形式 </label></td>
    </tr>
    <tr>
        <td colspan="2">
            <textarea style="width:440px;height: 64px;" id="areaContent" placeholder="输入框默认值..."></textarea>
        </td>
    </tr>
</table>
<script type="text/javascript">
    var oNode = null;
    window.onload = function () {
        //弹出窗口初始化函数，这里主要是判断是编辑多行文本框还是新增
        //以下这个对象定义在editor.all.js第13325行。
        if (UE.plugins['textarea'].editdom) {
            oNode = UE.plugins['textarea'].editdom;
            $G('areaName').value = oNode.getAttribute('title');
            $G('areaContent').value = oNode.getAttribute('value');
            var nRich = oNode.getAttribute('rich');
            if (nRich == '1') {
                $G('richText').checked = true;
            } else {
                nRich = '0';
            }
            var sFontSize = oNode.style.fontSize;
            $G('areaFontSize').value = sFontSize.substr(0, sFontSize.length - 2);//这里的substr是为了去掉末尾的'px'
            var sSizeWidth = oNode.style.width;
            $G('areaWidth').value = sSizeWidth.substr(0, sSizeWidth.length - 2);
            var sSizeHeight = oNode.style.height;
            $G('areaHeight').value = sSizeHeight.substr(0, sSizeHeight.length - 2);
        }
    }
    dialog.oncancel = function () {
        if (UE.plugins['textarea'].editdom) {
            delete UE.plugins['textarea'].editdom;
        }
    };
    dialog.onok = function () {
        if ($G('areaName').value == '') {
            alert('请输入控件名称');
            return false;
        }
        if (!oNode) {
            var sUrl = parent.getItemUrl;
            var nItemId = null;
            ajax.request(sUrl, {
                timeout: 60000, onsuccess: function (xhr) {
                    try {
                        nItemId = xhr.responseText;
                        var html = '<textarea ';
                        html += ' title = "' + $G('areaName').value + '"';
                        html += ' name = "data_' + nItemId + '"';
                        html += ' value = "' + $G('areaContent').value + '"';
                        if ($G('richText').checked) {
                            html += ' rich = "1"';
                            if ($G('areaWidth').value != '') {
                                html += ' rich_width = "' + $G('areaWidth').value + '"';
                            } else {
                                html += ' rich_width = ""';
                            }
                            if ($G('areaHeight').value != '') {
                                html += ' rich_height = "' + $G('areaHeight').value + '"';
                            } else {
                                html += ' rich_height = ""';
                            }
                        } else {
                            html += ' rich = "0"';
                        }
                        html += ' style = "';
                        if ($G('areaFontSize').value != '') {
                            html += 'font-size:' + $G('areaFontSize').value + 'px;';
                        }
                        if ($G('areaWidth').value != '') {
                            html += 'width:' + $G('areaWidth').value + 'px;';
                        }
                        if ($G('areaHeight').value != '') {
                            html += 'height:' + $G('areaHeight').value + 'px;';
                        }
                        html += '">';
                        html += $G('areaContent').value + '</textarea>';
                        editor.execCommand('insertHtml', html);
                    } catch (e) {
                        return;
                    }
                },
                error: function () {
                    alert('Request TimeOut');
                }
            })
        } else {
            oNode.setAttribute('title', $G('areaName').value);
            oNode.setAttribute('value', $G('areaContent').value);
            oNode.innerHTML = $G('areaContent').value;
            if ($G('richText').checked) {
                oNode.setAttribute('rich', 1);
            } else {
                oNode.setAttribute('rich', 0);
            }
            var style = '';
            if ($G('areaFontSize').value != '') {
                style += 'font-size:' + $G('areaFontSize').value + 'px;';
            }
            if ($G('areaWidth').value != '') {
                style += 'width:' + $G('areaWidth').value + 'px;';
                if ($G('richText').checked) {
                    oNode.setAttribute('rich_width', $G('areaWidth').value);
                }
            } else {
                if ($G('richText').checked) {
                    oNode.setAttribute('rich_width', '');
                }
            }
            if ($G('areaHeight').value != '') {
                style += 'height:' + $G('areaHeight').value + 'px;';
                if ($G('richText').checked) {
                    oNode.setAttribute('rich_height', $G('areaHeight').value);
                }
            } else {
                if ($G('richText').checked) {
                    oNode.setAttribute('rich_height', '');
                }
            }
            oNode.setAttribute('style', style);
            delete UE.plugins['textarea'].editdom; //使用后清空这个对象，变回新增模式
        }
    };
</script>
</body>
</html>
